<template>
  <div class="hello">
    <div class="first flexclass">
      <img src="../assets/logo.png" style="height: 5rem" />
      <img src="../assets/rightindexlogo.png" style="height: 3.3rem" />
    </div>
    <div class="second flexclass">
      <div class="firstrightdiv">
        <div class="secondlogin flexclass" v-if="!$store.state.isLogin">
          <img src="../assets/personwhite.png" />
          <div class="flexclass" style="width: 100%">
            <p class="loginnowclass" @click="loginnow()"><a>立即登录</a></p>
            <p class="loginnowclass" @click="registernow()">
              <span>免费注册</span>
            </p>
          </div>
        </div>
        <div
          class="secondlogin"
          style="display: flex; flex-direction: row"
          v-else
        >
          <div class="dengluhouleft" style="">
            <img :src="imgurl" class="dengluhouleftimg" />
          </div>
          <div class="dengluhouright" style="">
            <p
              @click="gotopage(0)"
              @mouseenter="imgchangeurl(0)"
              :class="imgactive == 0 ? 'fontactive' : ''"
              v-if="userqx == 'buyer'"
            >
              数据分析
            </p>
            <p
              @click="gotopage(1)"
              @mouseenter="imgchangeurl(1)"
              :class="imgactive == 1 ? 'fontactive' : ''"
            >
              工作台
              <!-- {{ $store.state.userType }} -->
            </p>
            <p
              @click="gotopage(2)"
              @mouseenter="imgchangeurl(2)"
              :class="imgactive == 2 ? 'fontactive' : ''"
            >
              退出登录
            </p>
          </div>
        </div>

        <div class="flexcolclass" style="height: 11rem">
          <p class="fontstyle">{{ sxxmnum || 0 }}</p>
          <p>上线项目(个)</p>
          <p
            class="fontstyle"
            style="position: relative; width: 100%; text-align: center"
          >
            <img
              src="../assets/rightjiantoushouye.png"
              style="
                width: 1rem;
                height: 1rem;
                position: absolute;
                left: 15%;
                top: 40%;
              "
            />{{ qwjyzj || 0 }}
          </p>
          <p>全网交易总额(亿元)</p>
        </div>
      </div>
      <div class="secongrightdiv" v-if="bannerlist.length > 0">
        <el-carousel
          style="height: 100%; overflow: hidden; transform: translateY(0)"
        >
          <!--  indicator-position="none"  -->
          <el-carousel-item
            style=""
            v-for="(item, index) in bannerlist"
            :key="index"
          >
            <div v-if="item.imageHref" style="width: 100%; height: 100%">
              <a :href="item.imageHref" target="_blank">
                <img :src="item.imagePath" style="width: 100%; height: 100%" />
              </a>
            </div>
            <img :src="item.imagePath" style="height: 100%" v-else />
          </el-carousel-item>
          <!-- <el-carousel-item>
            <img src="../assets/banner2.png" style="height: 100%" />
          </el-carousel-item>
          <el-carousel-item>
            <img src="../assets/banner3.png" style="height: 100%" />
          </el-carousel-item>
          <el-carousel-item>
            <img src="../assets/banner4.png" style="height: 100%" />
          </el-carousel-item> -->
        </el-carousel>
      </div>
      <div class="secongrightdiv" v-else>
        <el-carousel
          style="height: 100%; overflow: hidden; transform: translateY(0)"
        >
          <el-carousel-item>
            <img src="../assets/banner.png" style="height: 100%" />
          </el-carousel-item>
        </el-carousel>
      </div>
    </div>
    <div class="topbottom flexclass" v-if="$store.state.isLogin">
      <div
        class="test-boximg flexcolclass"
        v-for="(item, index) in ablemodule"
        :key="index"
        @click="catepopupshow(index)"
        @mouseenter="overindex(index)"
        @mouseleave="leaveindex(index)"
        :class="
          ($store.state.userType == 'seller' && index == 0) ||
          ($store.state.userType == 'seller' && index == 1) ||
          ($store.state.userType == 'seller' && index == 2) ||
          ($store.state.userType == 'seller' && index == 3) ||
          ($store.state.userType == 'seller' && index == 4) ||
          ($store.state.userType == 'seller' && index == 6) ||
          ($store.state.userType == 'seller' && index == 7) ||
          ($store.state.userType == 'seller' && index == 11) ||
          ($store.state.userType == 'buyer' && !vipgray && index == 11) ||
          ($store.state.userType == 'buyer' && !kspcgray && index == 3)
            ? 'gray'
            : ''
        "
      >
        <div v-if="item.isactive" class="flexcolclass" style="height: 80%">
          <img :src="item.img" style="width: 1.45rem; height: 1.46rem" />
          <p>{{ item.name }}</p>
        </div>
        <div
          v-if="!item.isactive && item.bottommodule"
          class="animate__animated animate__zoomIn"
          style="width: 100%"
        >
          <p class="hovertiaoclass">{{ item.bottommodule.catename1 }}</p>
          <p class="fontstyle" style="font-size: 1rem" id="zhaobiaojinri">
            <!-- 客商评测 -->
            <span v-if="index == 3">{{ kspcmesinfo.num1 || 0 }}</span>
            <!-- 数字共富-->
            <span v-if="index == 4">{{ szgfmesinfo.num1 || 0 }}</span>
            <!-- 金融商超-->
            <span v-if="index == 5">{{ jrscmesinfo.num1 || 0 }}</span>
            <!-- 采购计划-->
            <span v-if="index == 6">{{ cgjhmesinfo.num1 || 0 }}</span>
            <!-- 采购方案-->
            <span v-if="index == 7">{{ cgfamesinfo.num1 || 0 }}</span>
            <!-- 招标公告-->
            <span v-if="index == 8">{{ zbggmesinfo.num1 || 0 }}</span>
            <!-- 中标公示-->
            <span v-if="index == 9">{{ zbgsmesinfo.num1 || 0 }}</span>
            <!-- 结果发布-->
            <span v-if="index == 10">{{ jgfbmesinfo.num1 || 0 }}</span>
          </p>
          <p class="hovertiaoclass">{{ item.bottommodule.catename2 }}</p>
          <p class="fontstyle" style="font-size: 1rem" id="zhaobiaoleiji">
            <!-- 客商评测 -->
            <span v-if="index == 3">{{ kspcmesinfo.num2 || 0 }}</span>
            <!-- 数字共富-->
            <span v-if="index == 4"
              >{{ szgfmesinfo.num2 || 0
              }}<span style="font-size: 0.6rem">亿元</span></span
            >
            <!-- 金融商超-->
            <span v-if="index == 5"
              >{{ jrscmesinfo.num2 || 0
              }}<span style="font-size: 0.6rem">亿元</span></span
            >
            <!-- 采购计划-->
            <span v-if="index == 6">{{ cgjhmesinfo.num2 || 0 }}</span>
            <!-- 采购方案-->
            <span v-if="index == 7">{{ cgfamesinfo.num2 || 0 }}</span>
            <!-- 招标公告-->
            <span v-if="index == 8">{{ zbggmesinfo.num2 || 0 }}</span>
            <!-- 中标公示-->
            <span v-if="index == 9">{{ zbgsmesinfo.num2 || 0 }}</span>
            <!-- 结果发布-->
            <span v-if="index == 10">{{ jgfbmesinfo.num2 || 0 }}</span>
          </p>
        </div>
      </div>
    </div>
    <div class="topbottom flexclass" v-else>
      <div
        class="test-boximg flexcolclass"
        v-for="(item, index) in ablemodule"
        :key="index"
        @click="catepopupshow(index)"
        @mouseenter="overindex(index)"
        @mouseleave="leaveindex(index)"
      >
        <div v-if="item.isactive" class="flexcolclass" style="height: 80%">
          <img :src="item.img" />
          <p>{{ item.name }}</p>
        </div>
        <div
          v-if="!item.isactive && item.bottommodule"
          class="animate__animated animate__zoomIn"
          style="width: 100%"
        >
          <p class="hovertiaoclass">{{ item.bottommodule.catename1 }}</p>
          <p class="fontstyle" style="font-size: 1rem" id="zhaobiaojinri">
            <!-- 金融商超-->
            <span v-if="index == 5">{{ jrscmesinfo.num1 || 0 }}</span>
            <!-- 招标公告-->
            <span v-if="index == 8">{{ zbggmesinfo.num1 || 0 }}</span>
            <!-- 中标公示-->
            <span v-if="index == 9">{{ zbgsmesinfo.num1 || 0 }}</span>
            <!-- 结果发布-->
            <span v-if="index == 10">{{ jgfbmesinfo.num1 || 0 }}</span>
          </p>
          <p class="hovertiaoclass">{{ item.bottommodule.catename2 }}</p>
          <p class="fontstyle" style="font-size: 1rem" id="zhaobiaoleiji">
            <!-- 金融商超-->
            <span v-if="index == 5"
              >{{ jrscmesinfo.num2 || 0
              }}<span style="font-size: 0.6rem">亿元</span></span
            >
            <!-- 招标公告-->
            <span v-if="index == 8">{{ zbggmesinfo.num2 || 0 }}</span>
            <!-- 中标公示-->
            <span v-if="index == 9">{{ zbgsmesinfo.num2 || 0 }}</span>
            <!-- 结果发布-->
            <span v-if="index == 10">{{ jgfbmesinfo.num2 || 0 }}</span>
          </p>
        </div>
      </div>
    </div>
    <Dialog :modalVisible="visiable" :title="poptitle">
      <template>
        <div style="width: 100%; height: 100%">
          <div v-if="szjyvisiable" style="width: 100%; height: 100%">
            <Szjydialog />
          </div>
          <div v-if="znjbvisiable" style="width: 100%; height: 100%">
            <Znjbdialog />
          </div>
          <div v-if="jgzzvisiable" style="width: 100%; height: 100%">
            <Jgzzdialog />
          </div>
          <div v-if="kspcvisiable" style="width: 100%; height: 100%">
            <Kspcdialog />
          </div>
          <div v-if="szgfvisiable" style="width: 100%; height: 100%">
            <Szgfdialog />
          </div>
          <div v-if="jrscvisiable" style="width: 100%; height: 100%">
            <Jrscdialog />
          </div>
          <!-- <div v-if="cgjhvisiable" style="width: 30%; height: 50%">
            6采购计划 
          </div> -->
          <div v-if="hyjjvisiable" style="width: 100%; height: 100%">
            <Hyjjdialog />
          </div>
        </div>
      </template>
    </Dialog>
    <div class="changeeldialog">
      <el-dialog
        title="请选择采购计划类型"
        :visible.sync="cgjhvisiable"
        width="15%"
        style="margin-top: 6%; font-size: 1rem"
      >
        <div class="linka">
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=2$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=2$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=2$plantype=3;`"
              target="_blank"
              >项目类物资设备</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=7$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=7$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=7$plantype=3;`"
              target="_blank"
              >项目类机械租赁</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=1$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=1$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=1$plantype=3;`"
              target="_blank"
              >项目类劳务分包</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=a$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=a$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=a$plantype=3;`"
              target="_blank"
              >项目类专业分包</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=b$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=b$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=b$plantype=3;`"
              target="_blank"
              >项目类服务采购</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=e$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=e$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=e$plantype=3;`"
              target="_blank"
              >非项目类物资采购</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=f$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=f$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=f$plantype=3;`"
              target="_blank"
              >非项目类服务采购</a
            >
          </p>
          <p style="margin-bottom: 0.5rem">
            <a
              :href="`${this.base_url}/tabs?tabs=%E9%A1%B9%E7%9B%AE%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=h$plantype=1;%E5%88%86%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=h$plantype=2;%E5%AD%90%E5%85%AC%E5%8F%B8%E9%87%87%E8%B4%AD%E8%AE%A1%E5%88%92,/plan/simple/v?_m=pur/list$objtype=h$plantype=3;`"
              target="_blank"
              >非生产经营类</a
            >
          </p>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import APIS from "@/api/index";
import Dialog from "@/components/dialog.vue";
import Szjydialog from "@/components/szjydialog.vue";
import Znjbdialog from "@/components/znjbdialog.vue";
import Hyjjdialog from "@/components/hyjjdialog.vue";
import Jgzzdialog from "@/components/jgzzdialog.vue";
import Kspcdialog from "@/components/kspcdialog.vue";
import Szgfdialog from "@/components/szgfdialog.vue";
import Jrscdialog from "@/components/jrscdialog.vue";
import { Logout } from "@/utils/common.js";
export default {
  name: "HelloWorld",
  components: {
    Dialog,
    Szjydialog,
    Znjbdialog,
    Hyjjdialog,
    Jgzzdialog,
    Kspcdialog,
    Szgfdialog,
    Jrscdialog,
  },
  props: {
    msg: String,
  },
  data() {
    return {
      sxxmnum: 0,
      qwjyzj: 0,
      loading: false,
      imgactive: 0,
      imgurl: require("../assets/shujvfenxi.png"),
      ablemodule: [
        {
          name: "交易中心",
          img: require("../assets/shuzijiaoyi.png"),
          isactive: true,
        },
        {
          name: "智能降本",
          img: require("../assets/jiangben.png"),
          isactive: true,
        },
        {
          name: "价格追踪",
          img: require("../assets/zhaobiao.png"),
          isactive: true,
        },
        {
          name: "客商评测",
          img: require("../assets/keshangmanage.png"),
          isactive: true,
          bottommodule: { catename1: "累计供应商", catename2: "已注册供应商" },
        },
        {
          name: "数字共富",
          img: require("../assets/gongfu.png"),
          isactive: true,
          bottommodule: { catename1: "供应商总数", catename2: "合作金额" },
        },
        {
          name: "金融商超",
          img: require("../assets/shuzimoney.png"),
          isactive: true,
          bottommodule: {
            catename1: "认证企业数量",
            catename2: "累计签发金额",
          },
        },
        {
          name: "采购计划",
          img: require("../assets/caigoujihua.png"),
          isactive: true,
          bottommodule: { catename1: "今日·条", catename2: "累计·条" },
        },
        {
          name: "采购方案",
          img: require("../assets/caigoufnagan.png"),
          isactive: true,
          bottommodule: { catename1: "今日·条", catename2: "累计·条" },
        },
        {
          name: "招标公告",
          img: require("../assets/zhaobiaogonggao.png"),
          isactive: true,
          bottommodule: { catename1: "今日·条", catename2: "累计·条" },
        },
        {
          name: "中标公示",
          img: require("../assets/zhongbiao.png"),
          isactive: true,
          bottommodule: { catename1: "今日·条", catename2: "累计·条" },
        },
        {
          name: "结果发布",
          img: require("../assets/result.png"),
          isactive: true,
          bottommodule: { catename1: "今日·条", catename2: "累计·条" },
        },
        {
          name: "会员经济",
          img: require("../assets/servevip.png"),
          isactive: true,
        },
      ],
      szjyvisiable: false,
      visiable: false,
      poptitle: "",
      popindex: 0,
      znjbvisiable: false,
      jgzzvisiable: false,
      kspcvisiable: false,
      szgfvisiable: false,
      jrscvisiable: false,
      cgjhvisiable: false,
      hyjjvisiable: false,
      isClick: true,
      mesinfonum: { num1: "", num2: "" },
      kspcmesinfo: { num1: "", num2: "" },
      szgfmesinfo: { num1: "", num2: "" },
      jrscmesinfo: { num1: "", num2: "" },
      cgjhmesinfo: { num1: "", num2: "" },
      cgfamesinfo: { num1: "", num2: "" },
      zbggmesinfo: { num1: "", num2: "" },
      zbgsmesinfo: { num1: "", num2: "" },
      jgfbmesinfo: { num1: "", num2: "" },
      userqx: "",
      bannerlist: [],
      vipgray: false,
      kspcgray: true,
    };
  },
  mounted() {
    this.getOnlineProjectNum();
    this.getTotalAmount();
    // 3客商评测  4 数字共富 5金融商超  6采购计划 7采购方案 8招标公告  9中标公示  10结果发布

    // 3客商评测
    this.getSupplierEvaluate();
    //数字共富
    this.mountainSupplierandjine();
    // 金融商超
    this.getNumAndAmounthome();
    // 采购计划
    this.getPurchasePlan();
    //7采购方案
    this.getPurchaseOption();
    //8招标公告
    this.getTenderAnnouncement();
    // 9中标公示
    this.getBiddingPublicity();
    // 10结果发布
    this.getResultRelease();
    this.getbanner();
    this.userqx = this.$store.state.userType;
    if (this.$store.state.userType != "buyer") {
      this.imgactive = 1;
      this.imgchangeurl(1);
    }
    if (this.$store.state.menuPermissions != null) {
      // if (
      //   this.$store.state.menuPermissions.indexOf("MEMBER_ROLE") != -1 &&
      //   this.$store.state.menuPermissions.indexOf("BUSINESS_EVALUATING") != -1
      // ) {
      //   //会员经济  存在
      //   this.vipgray = true;
      //   this.kspcgray = true;
      // } else if (
      //   this.$store.state.menuPermissions.indexOf("BUSINESS_EVALUATING") != -1
      // ) {
      //   //客商评测  存在
      //   this.kspcgray = true;
      //   this.vipgray = false;
      // } else
      if (this.$store.state.menuPermissions.indexOf("MEMBER_ROLE") != -1) {
        //客商评测
        this.vipgray = true;
        // this.kspcgray = false;
      }
    }
    this.pageEvent();
  },
  methods: {
    returnFloat(num) {
      num = (parseInt(num * 100) / 100).toFixed(2);
      // num = num.toString(); // 转成字符串类型  如能确定类型 这步可省去
      // if (num.indexOf(".") !== -1) {
      //   let [integerPart, decimalPart] = num.split(".");

      //   if (decimalPart.length > 2) {
      //     decimalPart = decimalPart.substring(0, 2);
      //   } else if (decimalPart.length === 1) {
      //     decimalPart += "0";
      //   }

      //   num = `${integerPart}.${decimalPart}`;
      // } else {
      //   num += ".00";
      // }

      return num;
    },
    getbanner() {
      let arr = [];
      // getBanners
      APIS.Homepage.getBanners()
        .then((res) => {
          console.log(res, "res");
          res.data.map((item) => {
            arr.push({
              imageHref: item.imageHref,
              imagePath: `https://srm.cnzgc.com${item.imagePath}`,
            });
          });
          this.bannerlist = arr;
          console.log(this.bannerlist, "nanner");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    showmes() {
      this.$message({
        message: "未登录！",
        offset: window.screen.height / 2.8,
        duration: 1000,
      });
    },
    loginnow() {
      if (process.env.NODE_ENV === "test") {
        window.open("http://10.0.12.119:32002/base/main");
      } else {
        window.location.href = "https://srm.cnzgc.com/login/";
      }
    },
    registernow() {
      window.location.href = "https://srm.cnzgc.com/reg/register";
    },
    getOnlineProjectNum() {
      APIS.Homepage.getOnlineProjectNum()
        .then((res) => {
          this.sxxmnum = res.data;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getTotalAmount() {
      APIS.Homepage.getTotalAmount()
        .then((res) => {
          // this.qwjyzj =  res.data / 100000000 ;
          this.qwjyzj = Math.floor(res.data / 1000000) / 100;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getSupplierEvaluate() {
      APIS.Homepage.getSupplierEvaluate()
        .then((res) => {
          this.kspcmesinfo.num1 = res.data.total;
          this.kspcmesinfo.num2 = res.data.today;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getPurchasePlan() {
      APIS.Homepage.getPurchasePlan()
        .then((res) => {
          this.cgjhmesinfo.num1 = res.data.today;
          this.cgjhmesinfo.num2 = res.data.total;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getPurchaseOption() {
      APIS.Homepage.getPurchaseOption()
        .then((res) => {
          this.cgfamesinfo.num1 = res.data.today;
          this.cgfamesinfo.num2 = res.data.total;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getTenderAnnouncement() {
      APIS.Homepage.getTenderAnnouncement()
        .then((res) => {
          this.zbggmesinfo.num1 = res.data.today;
          this.zbggmesinfo.num2 = res.data.total;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getBiddingPublicity() {
      APIS.Homepage.getBiddingPublicity()
        .then((res) => {
          this.zbgsmesinfo.num1 = res.data.today;
          this.zbgsmesinfo.num2 = res.data.total;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getResultRelease() {
      APIS.Homepage.getResultRelease()
        .then((res) => {
          this.jgfbmesinfo.num1 = res.data.today;
          this.jgfbmesinfo.num2 = res.data.total;
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getNumAndAmounthome() {
      APIS.Jrsc.getNumAndAmount()
        .then((res) => {
          res.data.map((item) => {
            if (item.indName == "认证企业数量（家）") {
              this.jrscmesinfo.num1 = item.indValue;
            }
            if (item.indName == "累计签发金额（元）") {
              this.jrscmesinfo.num2 = this.returnFloat(
                item.indValue / 100000000
              );
            }
          });
          this.loading = true;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    mountainSupplierandjine() {
      APIS.Szgf.mountainSupplier()
        .then((res) => {
          this.szgfmesinfo.num1 = res.data;
        })
        .catch((err) => {
          console.log(err);
        });

      APIS.Szgf.totalBiddingAmount()
        .then((res) => {
          // this.szgfmesinfo.num2 = (res.data.totalprice / 100000000).toFixed(2);
          this.szgfmesinfo.num2 = this.returnFloat(
            res.data.totalprice / 100000000
          );
        })
        .catch((err) => {
          console.log(err);
        });
      setTimeout(() => {
        this.loading = true;
      }, 500);
    },
    imgchangeurl(index) {
      if (index == 0) {
        this.imgurl = require("../assets/shujvfenxi.png");
        this.imgactive = 0;
      } else if (index == 1) {
        this.imgurl = require("../assets/gongzuotai.png");
        this.imgactive = 1;
      } else {
        this.imgurl = require("../assets/tuichudenglu.png");
        this.imgactive = 2;
      }
    },
    gotopage(index) {
      if (index == 1) {
        APIS.Baseapi.verifyUserLogin().then((res) => {
          if (res.status == 501) {
            Logout();
          } else {
            if (process.env.NODE_ENV === "test") {
              window.open("http://10.0.12.119:32002/base/main");
            } else {
              window.open("https://srm.cnzgc.com/base/main");
            }
          }
        });
      } else if (index == 0) {
        //bi平台
        APIS.Baseapi.authgetBi()
          .then((res) => {
            if (res.status == 200) {
              window.open(
                `http://10.0.227.1/zcbi/ReportFrame/reportframe.html?id=${res.data.id}&timestamp=${res.data.timestamp}&rpt=zcbi.frm`
              );
            } else {
              this.$message({
                message: "未登录！",
                offset: window.screen.height / 2.8,
                duration: 1000,
              });
              // offset: window.screen.height / 2.4,
            }
          })
          .catch((err) => {
            console.log(err);
          });
      } else {
        //退出登录 loginout
        APIS.Baseapi.loginout()
          .then((res) => {})
          .catch((err) => {
            console.log(err);
          });
        document.cookie = "Token-buyer=; path=/;";
        document.cookie = "Token-usertype=; path=/;";
        document.cookie = "Token-operator=; path=/;";
        document.cookie = "Token-seller=; path=/;";

        localStorage.removeItem("kspcrightldt");
        localStorage.removeItem("statusarr");
        localStorage.removeItem("kspcbottomtopten");

        setTimeout(() => {
          window.location.reload();
        }, 500);
      }
    },
    pageEvent() {
      let url = window.location.href.split("?")[1];
      var reg = new RegExp("(^|&)" + "popupType" + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
      var r = url.match(reg); //匹配目标参数
      var dd = "";
      if (r != null) {
        dd = decodeURIComponent(r[2]);
      }
      this.catepopupshow(dd);
    },
    catepopupshow(index) {
      if (!this.$store.state.isLogin) {
        this.$message({
          message: "未登录！",
          offset: window.screen.height / 2.8,
          duration: 1000,
        });
        return;
      }
      // 判断token是否过期
      if (this.isClick) {
        this.isClick = false;
        APIS.Baseapi.verifyUserLogin().then((res) => {
          if (res.status == 501) {
            this.isClick = true;
            Logout();
          } else {
            if (this.$store.state.userType == "seller") {
              // 1智能降本 3客商评测 4数字共富 11会员经济  5 8 9 10
              if (
                index == 0 ||
                index == 1 ||
                index == 2 ||
                index == 3 ||
                index == 4 ||
                index == 6 ||
                index == 7 ||
                index == 11
              ) {
                return;
              }
            }

            this.popindex = index;
            // 0 交易中心 1智能降本 2价格追踪 3客商评测 4数字共富 5金融商超 6采购计划 7采购方案 8招标公告 9中标公示 10结果公布 11会员经济
            if (index == 0) {
              this.szjyvisiable = true;
              this.poptitle = "交易中心";
              this.visiable = true;
            } else if (index == 1) {
              this.znjbvisiable = true;
              this.poptitle = "智能降本";
              this.visiable = true;
            } else if (index == 2) {
              this.jgzzvisiable = true;
              this.poptitle = "价格追踪";
              this.visiable = true;
            } else if (index == 3) {
              //   vipgray: false,
              // kspcgray: false,
              // if (this.kspcgray) {
              this.kspcvisiable = true;
              this.poptitle = "客商评测";
              this.visiable = true;
              // }

              // if (res.status == 501) {
              //   this.$message({
              //     message: "未登录！",
              //     offset: window.screen.height / 2.5,
              //     duration: 1000,
              //   });
              //   return;
              // } else if (res.status == 502) {
              //   this.$message({
              //     message: "暂无权限",
              //     offset: window.screen.height / 2.5,
              //     duration: 1000,
              //   });
              //   return;
              // } else {
              //   this.kspcvisiable = true;
              //   this.poptitle = "客商评测";
              //   this.visiable = true;
              // }
            } else if (index == 4) {
              this.szgfvisiable = true;
              this.poptitle = "数字共富";
              this.visiable = true;
            } else if (index == 5) {
              this.jrscvisiable = true;
              this.poptitle = "金融商超";
              this.visiable = true;
            } else if (index == 6) {
              if (this.$store.state.userType == "buyer") {
                this.cgjhvisiable = true;
              }
            } else if (index == 7) {
              if (this.$store.state.userType == "buyer") {
                window.open(
                  this.base_url +
                    "/tabs?tabs=%E9%87%87%E8%B4%AD%E6%96%B9%E6%A1%88,/sourcing/buyer/simple/v?_m=proc/project/list$objtype=2;"
                );
              }
            } else if (index == 8) {
              window.open(
                this.base_url + "/portal/list?chnlcode=tender",
                "_blank"
              );
            } else if (index == 9) {
              window.open(
                this.base_url + "/portal/list?chnlcode=result",
                "_blank"
              );
            } else if (index == 10) {
              window.open(
                this.base_url + "/portal/list?chnlcode=bidresult",
                "_blank"
              );
            } else if (index == 11) {
              if (this.vipgray) {
                this.hyjjvisiable = true;
                this.poptitle = "会员经济";
                this.visiable = true;
              }
              // if (res.status == 501) {
              //   this.$message({
              //     message: "未登录！",
              //     offset: window.screen.height / 2.5,
              //     duration: 1000,
              //   });
              //   return;
              // } else if (res.status == 502) {
              //   this.$message({
              //     message: "暂无权限",
              //     offset: window.screen.height / 2.5,
              //     duration: 1000,
              //   });
              //   return;
              // } else {
              //   this.hyjjvisiable = true;
              //   this.poptitle = "会员经济";
              //   this.visiable = true;
              // }
            }
            this.isClick = true;
          }
        });
        // 0 交易中心 1智能降本 2价格追踪 3客商评测 4数字共富 5金融商超 6采购计划 7采购方案 8招标公告 9中标公示 10结果公布 11会员经济
      }
    },
    closepopup() {
      // 0 交易中心 1智能降本 2价格追踪 3客商评测 4数字共富 5金融商超 6采购计划 7采购方案 8招标公告 9中标公示 10结果公布 11会员经济
      if (this.popindex == 0) {
        console.log("交易中心");
        this.szjyvisiable = false;
      } else if (this.popindex == 1) {
        console.log("1智能降本");
        this.znjbvisiable = false;
      } else if (this.popindex == 2) {
        console.log("2价格追踪");
        this.jgzzvisiable = false;
      } else if (this.popindex == 3) {
        console.log("3客商评测");
        this.kspcvisiable = false;
      } else if (this.popindex == 4) {
        console.log("4数字共富");
        this.szgfvisiable = false;
      } else if (this.popindex == 5) {
        console.log("5金融商超");
        this.jrscvisiable = false;
      } else if (this.popindex == 6) {
        console.log("6采购计划");
        this.cgjhvisiable = false;
      } else if (this.popindex == 11) {
        console.log("11会员经济");
        this.hyjjvisiable = false;
      }
      this.visiable = false;
      this.poptitle = "";
    },
    overindex(index) {
      this.loading = false;

      //2价格追踪 3客商评测  4 数字共富 5金融商超  6采购计划 7采购方案 8招标公告  9中标公示  10结果发布

      // 3客商评测 5金融商超 8招标公告  9中标公示  10结果发布

      // 8招标公告  9中标公示  10结果发布 5金融商超 dengluqian

      if (!this.$store.state.isLogin) {
        if (index == 5 || index == 8 || index == 9 || index == 10) {
          this.ablemodule[index].isactive = false;
        }
      } else {
        if (this.$store.state.userType == "seller") {
          if (index == 5 || index == 8 || index == 9 || index == 10) {
            this.ablemodule[index].isactive = false;
          }
        } else {
          if (index != 0 && index != 1 && index != 2 && index != 11) {
            this.ablemodule[index].isactive = false;
          }
        }
      }
    },
    leaveindex(index) {
      this.mesinfonum.num1 = "";
      this.mesinfonum.num2 = "";
      if (this.$store.state.userType == "seller") {
        if (index == 5 || index == 8 || index == 9 || index == 10) {
          this.ablemodule[index].isactive = true;
        }
      } else {
        if (index != 0 && index != 1 && index != 2 && index != 11) {
          this.ablemodule[index].isactive = true;
        }
      }
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
.hello {
  width: 100%;
  box-sizing: border-box;

  .first {
    padding: 1rem;
    margin-bottom: 2rem;
  }

  .second {
    margin: 0 auto;
    width: 93%;
    height: 22.5rem;

    .firstrightdiv {
      width: 20%;
      height: 100%;

      .secondlogin {
        width: 100%;
        height: 50%;
        padding: 1rem;
        box-sizing: border-box;
        background-image: url("../assets/loginbg.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        color: white;
        flex-direction: column;
        align-items: center;

        .loginnowclass {
          cursor: pointer;

          a {
            color: white;
          }

          a:hover {
            color: #d7dde8;
          }
        }
      }
    }

    .secongrightdiv {
      width: 79.9%;
      height: 100%;
      border-radius: 10px;
      overflow: hidden;

      img {
        height: 100%;
        width: 100%;
      }
    }
  }

  .topbottom {
    width: 93%;
    margin: 0 auto;
    margin-top: 1rem;
    text-align: center;
  }

  .hovertiaoclass {
    text-align: center;
    width: 80%;
    margin: 0 auto;
    font-size: 0.8rem;
    background-color: #182c56;
    border-radius: 5.2rem;
    color: white;
  }

  .linka > p > a {
    color: #182c56;
    font-size: 0.8rem;
  }

  .linka > p > a:hover {
    text-decoration: underline;
  }

  .changeeldialog {
    .el-dialog__title {
      color: #182c56;
    }
  }

  .dengluhouleft {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
  }

  .dengluhouleftimg {
    width: 3.25rem;
    height: 3.25rem;
  }

  .dengluhouright {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 61%;
  }

  .dengluhouright > p {
    cursor: pointer;
  }

  .dengluhouright > p:hover {
    font-size: 1.3rem;
  }

  .fontactive {
    font-size: 1.3rem;
  }

  .gray {
    filter: grayscale(100%);
  }
}
</style>
<style>
.el-carousel__container {
  height: 100%;
}

.el-carousel__indicators--horizontal {
  left: 5%;
}

.el-carousel__button {
  width: 6px;
  height: 6px;
  background-color: white !important;
  border-radius: 5px;
}

.el-carousel__arrow {
  z-index: -1;
}

.el-carousel__indicator.is-active button {
  width: 2rem;
  height: 6px;
}
</style>
<style lang="scss">
.el-carousel__item {
  border-radius: 10px;
  overflow: hidden;
  transform: translateY(0);
}

.changeeldialog {
  .el-dialog__title {
    font-size: 1rem;
  }

  .el-dialog__body {
    padding-left: 15%;
  }
}
</style>
